import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 2.15

ApplicationWindow{ //窗口
    visible: true
    width: 1280
    height: 800
    title: qsTr("qml简单的登录界面")
    id:root
    color: "lightblue"
    Rectangle{
        color: "red"
        width: parent.width/2
        height: parent.height/2
        anchors.centerIn: parent
 
        Text { //文本说明：登录系统
            x: 530
            y:130
            width: 120
            height: 30
            font.pointSize: 24
            text: qsTr("登录系统") // 后续可以进行翻译
        }
//        用户名：username
        TextField{
            id:username
            x:440
            y:200
            width: 300
            height: 50
            font.pixelSize: 20
        }
//        密码：password
        TextField{
            id:password
            x:username.x
            y:username.y + username.height +10
            width: username.width
            height: username.height
            font.pixelSize: username.font.pixelSize
            echoMode: TextInput.Password  //设置输入模式为密码，设置后不能输入中文
        }
//        登录按钮：submit
        Button{
            id:submit
            x:password.x
            y:password.y +password.height + 10
            width: password.width
            height: password.height
            text: qsTr("登录")
            font.pixelSize: username.font.pixelSize
            onClicked: {
                console.log("登录: "+username.text+":"+ password.text)
                print("登录: ",username.text,":",password.text)
            }
        }
    }
 
}

//import QtQuick 6.5.1
//import QtQuick.Window 6.5.1
//import QtQuick.Controls 6.5.1
//import QtQuick.Layouts 6.5.1

// Window {
//     id: mainWindow
//     visible: true
//     width: 800
//     height: 600
//     title: "Complete QML Example"

//     // 菜单栏
//     MenuBar {
//         Menu {
//             title: "File"
//             MenuItem {
//                 text: "New"
//                 onTriggered: console.log("New file action")
//             }
//             MenuItem {
//                 text: "Open"
//                 onTriggered: console.log("Open file action")
//             }
//             MenuItem {
//                 text: "Save"
//                 onTriggered: console.log("Save file action")
//             }
//         }
//         Menu {
//             title: "Edit"
//             MenuItem {
//                 text: "Cut"
//                 onTriggered: console.log("Cut action")
//             }
//             MenuItem {
//                 text: "Copy"
//                 onTriggered: console.log("Copy action")
//             }
//             MenuItem {
//                 text: "Paste"
//                 onTriggered: console.log("Paste action")
//             }
//         }
//     }

//     // 工具栏
//     ToolBar {
//         id: toolbar
//         anchors.top: mainWindow.top
//         anchors.left: mainWindow.left
//         anchors.right: mainWindow.right
//         height: 40

//         ToolButton {
//             text: "Home"
//             onClicked: console.log("Home button clicked")
//         }
//         ToolButton {
//             text: "Search"
//             onClicked: console.log("Search button clicked")
//         }
//         //Separator { }
//         ToolButton {
//             text: "Settings"
//             onClicked: console.log("Settings button clicked")
//         }
//     }

//     // 主内容区域（可滚动）
//     ScrollView {
//         anchors.top: toolbar.bottom
//         anchors.bottom: statusBar.top
//         anchors.left: mainWindow.left
//         anchors.right: mainWindow.right

//         Rectangle {
//             width: contentWidth
//             height: contentHeight
//             color: "lightgray"

//             Text {
//                 text: "This is the main content area. It can be scrolled if the content exceeds the window size."
//                 anchors.centerIn: parent
//             }
//         }
//     }

//     // 侧边栏
//     Column {
//         anchors.left: mainWindow.left
//         anchors.top: toolbar.bottom
//         anchors.bottom: statusBar.top
//         width: 150
//         spacing: 10

//         Button {
//             text: "Sidebar Button 1"
//             onClicked: console.log("Sidebar Button 1 clicked")
//         }
//         Button {
//             text: "Sidebar Button 2"
//             onClicked: console.log("Sidebar Button 2 clicked")
//         }
//         Button {
//             text: "Sidebar Button 3"
//             onClicked: console.log("Sidebar Button 3 clicked")
//         }
//     }

//     // 底部状态栏
//     Item {
//         id: statusBar
//         anchors.bottom: mainWindow.bottom
//         anchors.left: mainWindow.left
//         anchors.right: mainWindow.right
//         height: 30

//         Text {
//             text: "This is the status bar. It can display various status information."
//             anchors.centerIn: statusBar
//         }
//     }
// }